<script type="text/javascript" src="/public/library/jquery/jquery.hoverIntent.js"></script>

<link rel="stylesheet" href="/public/library/hvn/hgallery.css" type="text/css" media="screen" charset="utf-8" />
<script src="/public/library/hvn/jquery.hgallery.js" type="text/javascript" charset="utf-8"></script>

<style>
.loading {
    background: url(/public/library/jquery/images/spinner.gif) no-repeat center center
}
div.featured-place-list-item
{
	border-bottom:1px solid #d8d9d9;
	min-height:80px;
}
div.active-place
{
	background: #e0f6fc;
}
div.featured-place-list-item-gallery
{
	display:none;
}
</style>    

<script type="text/javascript">

   $(function() {
		$("div.featured-place-list-item").hoverIntent(
		{
			sensitivity: 3, 
			interval: 200,
			timeout: 500,
			over: 		
			function(){ //mouse over
				$("div.hgallery_wrapper").parent().fadeOut(500);
	            //gallery 
	            
	            galleryUlHtml = $(this).parent().find(".featured-place-list-item-gallery").html();
				$("#featured-place-gallery").find(".ul_wrapper").html(galleryUlHtml);
				$("div.hgallery_wrapper").hgallery({
	             	    itemsPerPage : 3,
	                	animationSpeed : 'normal',
	                    itemWidth: 94,
	                    itemHeight: 86,
	                    itemMargin: 3, 
	                    itemTopMargin: 2,
	                    itemBorderWidth: 2,
	                    urWrapperBorderWidth:2,
	                    mainImageSize: 'large',
	            });
	            
	            //description
	            $("div.active-place-description").html($(this).parent().find(".featured-place-list-item-description").html());
	            
	            $(".featured-place-list-item").removeClass("active-place");
				$(this).addClass("active-place");
				$("div.hgallery_wrapper").parent().fadeIn(500);
	            
			},
			
			out:
			function() //mouse out
			{
				//$(this).removeClass("active-place");
			}
		}
		);
        //initialize

		$first = $("div.featured-place-list-item:eq(0)");
        galleryUlHtml = $first.parent().find(".featured-place-list-item-gallery").html();
		$("#featured-place-gallery").find(".ul_wrapper").html(galleryUlHtml);
		$("div.hgallery_wrapper").hgallery({
                	itemsPerPage : 3,
               	 	animationSpeed : 'normal',
                    itemWidth: 94,
                    itemHeight: 86,
                    itemMargin: 3, 
                    itemTopMargin: 2,
                    itemBorderWidth: 2,
                    urWrapperBorderWidth:2,
                    mainImageSize: 'large',
            });
            
         //description
         $("div.active-place-description").html($first.parent().find(".featured-place-list-item-description").html());
            
         $(".featured-place-list-item").removeClass("active-place");
		 $first.addClass("active-place");
   });
</script>

		                
<br/>
<div> <!--wrapper-->
<div class="left-category-box first-column" style="width:303px;">
	<span style="color:#1c96c3;padding-left:15px;font-size:15px;font-weight:bold;"><?=t(900) ?></span>

    <div style="min-height:400px;padding-left:2px"> 

		<div class="hgallery_wrapper" id="featured-place-gallery">
			    <div class="hgallery_main_image_div" style="text-align:center">
			           <img src='' class="hgallery_main_image" />
			    </div>
				<div style="clear:both;min-height:2px;"></div>
			    <div class="hgallery_item_navigation" style="min-height:30px"> 
			        <a href="javascript:void()" class="hgallery_item_prev"><img src="/public/themes/prime/images/left/homepage/gallery/prev_gallery19x19.png" border=0/></a>
			        	&nbsp;&nbsp;
			            <span class="imageIndex"></span>/<span class="imageTotal"></span>&nbsp;&nbsp;
			        <a href="javascript:void()" class="hgallery_item_next"><img src="/public/themes/prime/images/left/homepage/gallery/last_gallery19x19.png" border=0/></a>
			    </div>

			    <div class="ul_wrapper"> <!-- image li list ul -->
			        <ul class="hgallery_ul">
			        </ul>
			    </div>

			    <div>
			        <ul class="hgalery_page_navigation_ul">
			            <li class="prev"><a href="#"><?=t(3) ?></a>
			            </li>
			            <li>
			                    <span class="pageIndex"></span>/<span class="pageTotal"></span>
			            </li>
			            <li class="next"><a href="#"><?=t(4) ?></a>
			            </li>
			        </ul>                
			    </div>
		</div> <!--hgallery_wrapper -->
        <div style="clear:both"></div>
        <div class="active-place-description" style="width:303px;text-align:justify;padding-left:3px;padding-right:2px"> <!-- description -->
            
        </div>
    </div>
</div><!--left-category-box  first-->

<div class="left-category-box second-column" style="width:320px;">
  <div class="left-category-content" style="border-top:1px solid #d8d9d9;" >
	<?foreach ($this->placeList as $p):?>
	<div>
                <div class="featured-place-list-item">
                    <h3 style="color:#fe7404;padding-top:0px;margin-top:0px;margin-bottom:0px;"><?=$this->aList[$p['id']]['article_title']?></h3>
                    <p style="text-align:justify;padding-left:5px;padding-right:5px;"><?=str_first_words(strip_tags($this->aList[$p['id']]['article_body']),50)?></p>
                    
                    
                    <div style="height:20px;text-align:right;padding-right:5px">
						<a class="viewmore" href="<?=$this->hvnUrl(array('action' => 'view', 'module' => 'place'),'nocontroller')?>?id=<?= $p['id']?>" >>><?=t(150) ?></a>
<!--
	                    <img src="/public/themes/prime/images/icon_sao.png"/> <img src="/public/themes/prime/images/icon_sao.png"/> <img src="/public/themes/prime/images/icon_sao.png"/> <img src="/public/themes/prime/images/icon_sao.png"/> <img src="/public/themes/prime/images/icon_sao.png"/> (34 ratings)
-->
                    </div>
                </div>
                
                <div class="featured-place-list-item-gallery">
                	<ul class="hgallery_ul">
                		<?foreach ($this->placeGalleries[$p['id']]['displayFiles'] as $f) :?>
			            <?if (file_exists(APP_PATH . sprintf( $this->placeGalleries[$p['id']]['base'], "xsmall") . $f)) :?>
			                <li><img src="<?=sprintf($this->placeGalleries[$p['id']]['base'], "xsmall") . $f?>"></li> 
			            <?endif?>
			        <?endforeach?>
                	</ul>
                </div> 

                <div class="featured-place-list-item-description" style="display:none">
                    <h3><a href="<?=$this->hvnUrl(array('action' => 'view', 'module' => 'place'),'nocontroller')?>?id=<?= $p['id']?>"><?=$this->aList[$p['id']]['article_title']?></a></h3>
                    <p><?=str_first_words(strip_tags($this->aList[$p['id']]['article_body']),115)?></p>
                    <div style="height:20px;text-align:right;padding-right:5px;">
						<a class="viewmore" href="<?=$this->hvnUrl(array('action' => 'view', 'module' => 'place'),'nocontroller')?>?id=<?= $p['id']?>">>><?=t(150) ?></a>
                    </div>
                </div> 
                
	  </div>   
	  <?endforeach?>
   </div>
</div>	<!--left-category-box  second-column-->
</div>  <!--wrapper-->

	    <div class="clear"><br/></div>


